import React from 'react'
import { Link } from 'react-router-dom'
import PropTypes from 'prop-types'
export default class User extends React.Component {
    static propTypes = {
        error: PropTypes.string,
        isLogin: PropTypes.bool,
        username: PropTypes.string,
        first_name: PropTypes.string,
        last_name: PropTypes.string,
        makeLogout: PropTypes.func.isRequired,
        getProfile: PropTypes.func.isRequired
    }    
    constructor(props){
        super(props)
        this.props.getProfile()
    }
    handleSubmit() {
        this.props.makeLogout()
    }
    render(){
		let error = null;
		if(this.props.error){
			error = <div>{this.props.error}</div>
        }
        if(this.props.isLogin){
            return(
                <div>
                    {error}
                    <div> Welcome, {this.props.username}</div>
                    <div>First name: {this.props.first_name}</div>
                    <div>Last name: {this.props.last_name}</div>
                    <button onClick={() => this.handleSubmit()} name="logout">Logout</button>
                    <Link to="/updateProfile">Edit Profile</Link>
                </div>
            )
        }
        else{
            return (
                
                <div>{error}
                    <div>
                        Please <Link to="/login">login</Link> first
                    </div>    
                </div>  
                ) 
        }
    }
}